<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=0, viewport-fit=cover" />
	<title>map</title>
</head>
<body>
<script>
const map = [1, 2, 3]

// map.set('a', 1)
// map.set('b', 2)
// map.set({ name: 'tom' }, 3)
// map.set({ name: 'tom' }, 4)

// console.log(`map------`, map)

const res = map[Symbol.iterator]()
console.log(`res------`, res)

console.log(`res.next()---`, res.next())
console.log(`res.next()---`, res.next())
console.log(`res.next()---`, res.next())
console.log(`res.next()---`, res.next())

// for (let val of map) {
// 	console.log(val)
// }

Array.prototype[Symbol._iterator] = function () {
	// console.log(`this----`, this === arr)
	const _this = this;
	let index = 0;
	return {
		next: function () {
			return {
				value: _this[index++],
				done : _this.length < index,
			}
		}
	}
}
const arr = [1, 2, 3];
const result = arr[Symbol._iterator]()
console.log(`result----`, result)
console.log(`result.next()----`, result.next())
console.log(`result.next()----`, result.next())
console.log(`result.next()----`, result.next())
console.log(`result.next()----`, result.next())

</script>
</body>
</html>
